<template>
	<view class="application">
		<!-- <uni-nav-bar color="#000" background-color="#fff" :status-bar="true" left-icon="arrowleft" left-text="转会审核" title="转会审核" @clickLeft="back" /> -->
		<view class="wrapper" v-if="showMember">
			<view class="application_content" >
				<view class="application_header">
					<view class="application_lt">
						<view class="name">
							<text>{{memberData.idCardName?memberData.idCardName:''}}</text>
							<text class="sex">({{memberData.gender?memberData.gender:''}}</text>
							<text class="type_name">{{memberData.type_name?memberData.type_name:""}})</text>
						</view>
						<view class="status">
							<uni-tag
								:text="memberData.status['text']" 
								size="small" 
								:inverted="true" 
								:circle="true"
								:type="memberData.status['value']">
							</uni-tag>
							</uni-tag>
						</view>
					</view>
					<view class="application_rt">
						<!-- <image src="../../static/default-avatar.png" mode=""></image> -->
					</view>
				</view>
				<view class="application_mid">
					<view class="cell">
						<view class="">
							证件号
						</view>
						<view class="">
							{{memberData.idCard?memberData.idCard:"暂无"}}
						</view>
					</view>
					<view class="cell">
						<view class="">
							注册时间
						</view>
						<view class="">
							{{memberData.create_time}}
						</view>
					</view>
					<view class="cell">
						<view class="">
							到期时间
						</view>
						<view class="">
							{{memberData.end_time}}
						</view>
					</view>
				</view>
			</view>
			
			<view class="application_content">
				<view class="application_mid">
				<view class="org_title">
					申请方信息
				</view>
				<view class="cell">
					<view class="">
						机构名
					</view>
					<view class="">
						{{memberData.org_name?memberData.org_name:"暂无"}}
					</view>
				</view>
				<view class="cell">
					<view class="">
						联系人
					</view>
					<view class="">
						{{memberData.link_name?memberData.link_name:"暂无"}}
					</view>
				</view>
				<view class="cell">
					<view class="">
						联系电话
					</view>
					<view class="">
						{{memberData.link_phone?memberData.link_phone:"暂无"}}
					</view>
				</view>
				</view>
			</view>
			
			<view class="application_reason" v-if="noReason==false">
				<view class="title">
					申请理由
				</view>
				<view class="textreason">
					{{memberData.reason}}
				</view>
			</view>
			
			<view class="application_no" v-if='noReason'>
				<view class="title">
					申请理由
				</view>
				<view class="cell_rt">
					无
				</view>
			</view>
			
			<view class="application_pic" v-if='no_pic==false'>
				<view class="title">
					图片说明
				</view>
				<view class="img_list">
					<view class="img" v-for="(item,index) in memberData.img_files" :key="index">
						<image :src="item" @load='loadOver'  @tap.stop="preImg(item)"></image>
					</view>
				</view>
			</view>
		</view>
		
		
		<uni-check
				:popup="popupData"
				:showPopup="showPopup"
				:isAgree="isAgree"
				:type="type"
				@toAgree='popupAgree'
				@toNotAgree='popupNotAgree'
				@toCancel="toCancel"
				class="popupchecking"
				>
		</uni-check>
		<view class="footer" v-if="showMember">
			<button  size="mini" plain="true" class="btn bWhite" @tap.stop="noAgree">拒绝</button>
			<button  size="mini" class="btn bBlue" @tap.stop="agree">同意</button>
		</view>
	</view>
</template>
<script>
	import uniTag from "@/components/uni-tag/uni-tag.vue";
	import uniCheck from "@/components/uni-event/uni-check.vue";
	import {findMember,rankExtent,transferApplication} from "@/common/api.js";
	import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue"
	export default{
		data(){
			return{
				txtBook_no:"",
				memberData:{},
				showPopup:false,
				popupData:{},
				isAgree:false,
				type:"transfer",
				guid:"",
				showMember:false,
				no_pic:false,
				noReason:false,
				isLodaOver:false
			}
		},
		components:{
			uniTag,
			uniCheck,
			uniNavBar
		},
		onLoad(e) {
			var _this=this;
			_this.guid=e.guid;
			_this.txtBook_no=e.idcard;
			_this.getRankExtent();
			uni.showLoading({
				title:"加载中..."
			})
			setTimeout(function(){
				uni.hideLoading()
				_this.showMember=true;
			},1000)
		},
		methods:{
			back(){
				uni.redirectTo({
					url:"/pages/memberTransfer/memberTransfer"
				});
			},
			//获取级别范围
			getRankExtent() {
				var _this = this;
				//测试
					// _this.rankSet.itemObject.step_1.push({type_name:'1级'},{type_name:"2级"})
					// _this.rankSet.itemObject.step_2.push([{type_name:'2级'},{type_name:"1级"}],[{type_name:'3级'},{type_name:"4级"}])
					
				rankExtent().then(function(res) {
					var e = res.data;
					if (e.errcode == 0) {
						if (e.data.length > 0) {
							_this.rank_arr=e.data;
							
							//测试
							// _this.txtBook_no="110101199003078654"
							_this.searchMember();
						}
					}
				})
			},
			loadOver(){
				this.isLodaOver=true;
			},
			searchMember(){
				var _this=this,data={};
				_this.noSearch=true;
				data={
					idcard:_this.txtBook_no,
					guid:_this.guid
				}
				findMember(data).then(function(res){
					// console.log(res)
					var e=res.data;
					if(e.errcode==0){
						if(e.data!=null){
							_this.noSearch=false;
							e.data.gender=e.data.sex=="0"?"男":"女";
							e.data.create_time=e.data.fees_start!=null?e.data.fees_start.slice(0,4)+"年"+e.data.fees_start.slice(5,7)+"月"+e.data.fees_start.slice(8,10)+'日':"暂无",
							e.data.end_time=e.data.fees_end!=null?e.data.fees_end.slice(0,4)+"年"+e.data.fees_end.slice(5,7)+"月"+e.data.fees_end.slice(8,10)+'日':"暂无"
							e.data.status=_this.checkState(e.data.transfer_state)
							_this.rank_arr.map(function(item,index){
								if(e.data.level==item.eventType_id){
									e.data.type_name=item.type_name
								}
							})
							if(e.data.transfer_in_files!=null){
								var img_list=[],img_arr=[];
								img_list=e.data.transfer_in_files.split(",")
								img_list.map(function(item,index){
									item="https:"+_this.$store.state.baseImgURL+item
									img_arr.push(item)
								})
								// console.log(img_arr)
								e.data.img_files=img_arr;
								_this.no_pic=false;
							}else{
								_this.no_pic=true;
							}
							_this.noReason=(e.data.transfer_in_reason==null||e.data.transfer_in_reason=="")?true:false;
							e.data.reason=e.data.transfer_in_reason
							_this.memberData=e.data;
						}
					}else if(e.errcode==1000||e.errcode==1001){
						uni.removeStorageSync('token');
						uni.reLaunch({
							url:'/pages/home/welcome'
						})
					}else{
						uni.showToast({
							position: 'center',
							icon: 'none',
							title:e.msg
						});
					}
				})
			},
			checkState(state){
				if(state==1){
					return {text:"待处理",value:"warning"}
				}else if(state==2){
					return {text:"正常",value:"success"}
				}else if(state==4){
					return {text:"过期",value:"warning"}
				}
			},			
			agree(){
				var _this=this;
				_this.isAgree=true;
				_this.popupData={
					cancelMsg:"取消",
					confirmMsg:"确认",
					isPopupHeader:true,
					isPopupInput:false,
					isPopupFooter:true,
					isPopupContent:false,
					title:'同意转会申请',
					name:_this.memberData.idCardName
				}
				_this.showPopup=true;
			},
			noAgree(){
				var _this=this;
				_this.isAgree=false;
				_this.popupData={
					cancelMsg:"取消",
					confirmMsg:"确认",
					isPopupHeader:true,
					isPopupInput:true,
					isPopupFooter:true,
					isPopupContent:false,
					title:'拒绝转会申请',
					name:_this.memberData.idCardName
				}
				_this.showPopup=true;
			},
			popupAgree(){
				var _this=this,data={};
				data={
					guid:_this.guid,
					transfer_state:2,
					reason:""
				}
				transferApplication(data).then(function(res){
					var e=res.data;
					if(e.errcode==0){
						uni.showModal({
							title: '',
							content: "审核成功!",
							showCancel:false,
							confirmText:"确认",
							confirmColor:"#2680EB",
							success(res) {
							 if (res.confirm) {
									var pages=getCurrentPages();
									var prePages = pages[pages.length - 2];//获取到上一个页面对象
									// console.log(pages)
									// if (page == undefined || page == null) return; 
									prePages.onPullDownRefresh()
									uni.navigateBack({
										delta:1
									})
								}
							}
						});
					}else if(e.errcode==1000||e.errcode==1001){
						uni.removeStorageSync('token');
						uni.reLaunch({
							url:'/pages/home/welcome'
						})
					}else{
						uni.showToast({
							position: 'center',
							icon: 'none',
							title:e.msg
						});
					}
					_this.showPopup=false;
				})
			},
			popupNotAgree(reason){
				var _this=this,data={};
				if(reason==""||reason==null){
					uni.showToast({
						title:"请输入拒绝理由！",
						icon:"none"
					})
					return;
				}
				data={
					guid:_this.guid,
					transfer_state:4,
					reason:reason
				}
				transferApplication(data).then(function(res){
					var e=res.data;
					if(e.errcode==0){
						uni.showModal({
							title: '',
							content: "审核成功!",
							showCancel:false,
							confirmText:"确认",
							confirmColor:"#2680EB",
							success(res) {
							 if (res.confirm) {
									var pages=getCurrentPages();
									var prePages = pages[pages.length - 2];//获取到上一个页面对象
									// console.log(pages)
									// if (page == undefined || page == null) return; 
									prePages.onPullDownRefresh()
									uni.navigateBack({
										delta:1
									})
								}
							}
						});
					}else if(e.errcode==1000||e.errcode==1001){
						uni.removeStorageSync('token');
						uni.reLaunch({
							url:'/pages/home/welcome'
						})
					}else{
						uni.showToast({
							position: 'center',
							icon: 'none',
							title:e.msg
						});
					}
					_this.showPopup=false;
				})
			},
			toCancel(){
				var _this=this;
				_this.showPopup=false;
				// _this.guid=""
			},
			//预览
			preImg(imgSrc){
				var _this=this;
				// console.log(imgSrc)
				uni.previewImage({
					current:"https:"+imgSrc,
					urls:_this.memberData.img_files
				})
			}
		}
	}
</script>
<style lang="less" scoped>
	.application{
		overflow-y: auto;
	}
	.wrapper{
		padding-bottom: 100rpx;
	}
	.application_content{
		margin:24rpx;
		padding: 28rpx 44rpx;
		background: #fff;
		padding-bottom: 30rpx;
		border-bottom: 2rpx solid #F1F1F2;
		.application_header{
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			width: 100%;
			border-bottom: 2rpx dashed #DBDBDB;
			padding-bottom: 28rpx;
		}
		.application_lt{
			display: flex;
			flex-direction: row;
			align-items: center;
			.name{
				display: flex;
				flex-direction: row;
			}
			.sex{
				padding-left: 20rpx;
			}
			.type_name{
				padding-left: 14rpx;
			}
		}
		.application_rt{
			display: flex;
			flex-direction: column;
			justify-content: center;
			image{
				width: 140rpx;
				height: 40rpx;
			}
		}
		text{
			font-size: 32rpx;
		}
		.status{
			padding-left: 20rpx;
		}
	}
	.application_mid{
		margin-top: 4rpx;
		.cell{
			padding-top: 20rpx;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			view:last-child{
				color: #676767;
			}
		}
		.org_title{
			font-size: 32rpx;
			// border-top: 2rpx dashed #dbdbdb;
			border-bottom: 2rpx dashed #dbdbdb;
			// margin-top: 26rpx;
			padding-bottom: 20rpx;
		}
	}
	.application_reason{
		// width: 100%;
		margin: 0 24rpx;
		padding: 24rpx;
		background: #fff;
		.uni-textarea{
			width: 100%;
			margin-top: 10rpx;
		}
	}
	.application_pic{
		// margin-top: 12rpx;
		margin: 24rpx 24rpx 0;
		padding: 24rpx;
		background: #fff;
		.uploadImg{
			display: flex;
			flex-direction: row;
			.tip{
				color: #D9D9D9;
				align-self: center;
			}
		}
	}
	.application_no{
		margin: 24rpx 24rpx 0;
		padding: 24rpx;
		background: #fff;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		.cell_rt{
			color: #8E8E93;
		}
	}
	.application_reason{
		// width: 100%;
		margin: 0 24rpx;
		padding: 24rpx;
		background: #fff;
	}
	.title{
		font-size: 32rpx;
	}
	.textreason{
		text-indent: 2em;
		color: #8E8E93;
	}
	.application_pic{
		margin: 24rpx 24rpx 0 24rpx;
		padding: 24rpx;
		background: #fff;
		.img_list{
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			image{
				margin-top: 20rpx;
				margin-right: 10rpx;
				width: 162rpx;
				height: 162rpx;
			}
		}
	}
	.footer{
		position: fixed;
		bottom: 20rpx;
		width: 100%;
		z-index: 1000;
		display: flex;
		flex-direction: row;
		button::after{ border: none;}
		.btn{
			width: 48%;
			// background: #1A66FF;
		}
		.bWhite{
			color:#1A66FF ;
			border: 2rpx solid #1A66FF;
			background: #fff;
		}
		.bBlue{
			background: #1A66FF;
			color: #fff;
		}
	}
</style>
